var obj = {},
    height = $(document).height(),
    toast = function (message, type) {
        $.toast(message, type ? type : 'forbidden');
        setTimeout(function () {
            $('a.active').prev().click();
        }, 2000);
    },
    get_last_num = function (a) {
        const b = a % 4;
        return b ? b : 5;
    };

// 隐藏切换的li
$(document).on('click', function (e) {
    var $ul = $('ul'),
        $change = $('.change-type');
    if (e.target !== $ul && e.target !== $change[0] && e.target !== $change.find('span')[0] && e.target !== $change.find('img')[0]) {
        $ul.hide();
    }
});

// 聚焦隐藏提示
$('input')
    .focus(function () {
        if ($(window).height() !== height) {
            $('footer').hide();
        }

        obj.text = $(this).attr('placeholder');
        $(this).attr('placeholder', '');
    })
    .blur(function () {
        $('footer').show();
        $(this).attr('placeholder', obj.text);
    });

// 导航点击
$('nav a').click(function () {
    var $el = $('nav a.active'),
        $hide_div = $($el.attr('href')),
        $input = $hide_div.find('input'),
        $show_div = $($(this).attr('href'));

    if (this === $el || $(this).prev().find('.nav-value span').css('display') === 'none') {
        return false;
    } else {
        $el.removeClass('active');
        $hide_div.hide();
        query($input.val('')); // 还原搜索框
        $(this).addClass('active');
        $show_div.show();
    }

    // 取消锚点进入历史记录
    location.replace(this.href);
    return false;
});

// 获取当前站点
var getCurrentStation = function () {
    var $start = $('#start');

    // 同步获取所有站点
    renderAllStations().done(function () {

        $start.find('i').hide();

        // 获得当前位置
        return $.ajax({
            url: '/RailwayService/entrance/getCurrentStation',
            type: 'GET',
            dataType: 'json',
            timeout: 5 * 1000,
            async: true,
            beforeSend: function () {
                $.showLoading('获取当前站点...');
            },
            success: function (res) {
                if (res.success) {
                    obj.startStation = res.data.stationName;
                    obj.startStationId = res.data.stationId;
                } else {
                    obj.startStation = "深圳北";
                    obj.startStationId = 'IOQ';
                    console.log({'获取当前位置失败': res});
                }
            },
            error: function (xhr) {
                // 未获得位置默认出发站点
                obj.startStation = "深圳北";
                obj.startStationId = 'IOQ';
                console.log({'获取当前位置失败': xhr});
            },
            complete: function () {
                $.hideLoading();
                $start.find('span').text(obj.startStation).show();
                $('#train').click();
                renderTrain();
            }
        });
    });
};

// 获取出发站名
var renderAllStations = function (stationName) {
    var rendered = false,
        render = function (data) {
            var html_not_found = `<div class="not-found" style="display: none;">未查询到发车的车次</div>`,
                $content = $('#start-city').find('.city-content');
            $content.empty().append(html_not_found);
            $.each(data, function () {
                $content.append(
                    `<div class="box-block block" data-target="#start"
                        data-name="${this.stationName}" data-abbr="${this.stationNameAbbr || ''}"
                        data-spell="${this.spell || ''}" data-stationId="${this.stationId || ''}">
                        <div><span>${this.stationName || ''}</span></div>
                     </div>`.trim());
            });

            // 取消占位class
            $content.find(`.box-block:not(:nth-last-of-type(n+${get_last_num(data.length)}))`.trim()).removeClass('block');
            rendered = true;
        };

    // 获取最新出发站名
    return $.ajax({
        url: '/RailwayService/railwayStation/queryAllSpeedRailWayStations',
        type: 'GET',
        dataType: 'json',
        timeout: 5 * 1000,
        beforeSend: function () {
            $.showLoading('加载城市列表...');
        },
        success: function (resp) {
            $.hideLoading();
            if (resp.success) {
                render(resp.data);
                // 修改触发动作
                if (stationName) {
                    $(`.box-block[data-name="${stationName}"]`.trim()).click();
                }
            } else {
                console.log(resp.message);
                return $.confirm('取得城市列表错误，点击确认后刷新页面', '', function () {
                    window.location.reload();
                });
            }
        },
        error: function (XHR) {
            $.hideLoading();
            console.log(XHR); // log
            return $.alert('点击确认后刷新页面', '服务器未响应', function () {
                window.location.reload();
            });
        }
    });
};

// 根据当前站点名, 获取发车表
var renderTrain = function (trip) {
    var rendered = false,
        $train = $('#train'),
        render = function (data) {
            var text, that,
                html = `
                    <div class="box-block block" data-target="#train" data-trip="G1">
                        <span class="trip">G1</span>
                        <div class="time">1:11</div>
                    </div>`.trim(),
                html2 = `<div class="box-block more block" data-toggle=".checi">查看更多</div>`.trim(),
                html3 = `<div class="not-found" style="display: none;">未查询到发车的车次</div>`.trim(),
                max_num = 19,
                els = {
                    'G': [
                        $('.trip-content[data-name="content"] .gaotie'),
                        $('.trip-content[data-name="content-search"] .gaotie')
                    ],
                    'D': [
                        $('.trip-content[data-name="content"] .dongche'),
                        $('.trip-content[data-name="content-search"] .dongche')
                    ]
                };

            $.each(els, function (key, arr) {
                // 初始化
                $.each(arr, function (idx) {
                    this.empty().append(html3);
                    that = this;
                    // 渲染数据
                    $.each(data[key], function (num) {
                        text = html.replace(/G1/g, this.lineNo).replace('1:11', this['departTime']);
                        if (idx === 0) {
                            // 显示页默认最大渲染数
                            if (num < max_num) {
                                that.append(text);
                            }

                            // 显示页追加更多按钮
                            if (num === max_num) {
                                that.append(html2.replace('checi', key === 'G' ? 'gaotie' : 'dongche'));
                            }
                        } else {
                            that.append(text);
                        }
                    });

                    // 是否显示not-found
                    if (that.find('.box-block').length === 0) {
                        that.find('.not-found').show();
                    }
                });
            });
            rendered = true;
        };

    // 获取最新发车表
    return $.ajax({
        url: '/RailwayService/railwayStation/queryLineStationByStationName.do?stationName=' + obj.startStation,
        type: 'GET',
        dataType: 'json',
        timeout: 5 * 1000,
        beforeSend: function () {
            $.showLoading('获取发车列表...');
        },
        success: function (resp) {
            $.hideLoading();
            if (resp.success) {
                // 动态渲染高铁、动车元素
                render(resp.data);

                // 修改触发动作
                if (trip) {
                    var $el = $(`.box-block[data-trip="${trip}"]`);
                    if ($el.length !== 0) {
                        $el.click();
                    } else {
                        $train.find('i.iconfont').hide();
                        $train.find('span').text(trip).show();
                        $('a.active').next().click();
                        renderDestination(obj.destination);
                    }
                }
            } else {
                console.log(resp.message);
                return $.alert('确认后返回城市选择', '加载数据错误', function () {
                    $('a.active').prev().click();
                });
            }
        },
        error: function (xhr) {
            $.hideLoading();
            console.log({'车次列表加载失败': xhr});
            return $.alert('确认后返回城市选择', '加载数据错误', function () {
                $('a.active').prev().click();
            });
        }
    });
};

$('div.change-type').click(function () {
    $('ul').show();
});

// 切换车次类别
$('ul li').click(function () {
    var $span = $(this).parents('.change-type').find('span'),
        text = $(this).text(),
        value = $span.text();

    if (text !== value) {
        $(this).parents('.weui-flex').find('input').val('').keyup();
        if (text === '高铁G') {
            $('.gaotie').show();
            $('.dongche').hide();
        } else {
            $('.dongche').show();
            $('.gaotie').hide();
        }
    }
    $span.text(text);
});

// 根据站点、车次, 获取终点站列表
var renderDestination = function (destination) {
    var rendered = false,
        render = function (data) {
            var html_not_found = `<div class="not-found" style="display: none;">未查询到发车的车次</div>`.trim(),
                $content = $('#terminal').find('.city-content');
            $content.empty().append(html_not_found);
            $.each(data, function () {
                $content.append(`
                    <div class="box-block block" data-target="#end" data-name="${this.station || ''}"
                        data-id="${this.cityId || ''}" data-time="${this.arriveTime || ''}"
                        data-abbr="${this.stationNameAbbr || ''}" data-spell="${this.spell || ''}">
                        <span>${this.station || ''}</span>
                    </div>`.trim());
            });

            // 取消占位class
            $content.find(`.box-block:not(:nth-last-of-type(n+${get_last_num(data.length)}))`.trim()).removeClass('block');
            rendered = true;
        };

    // 获取最新终点站
    return $.ajax({
        url: '/RailwayService/railwayStation/getDestinationByStationAndNo.do?',
        type: 'GET',
        data: {stationName: obj.startStation, lineNo: obj.trip},
        dataType: 'json',
        timeout: 5 * 1000,
        beforeSend: function () {
            $.showLoading('加载终点站信息...');
        },
        success: function (resp) {
            $.hideLoading();
            if (resp.success) {
                render(resp.data);
                if (destination) {
                    $(`.box-block[data-target="#end"][data-name="${destination}"]`.trim()).click();
                }
            } else {
                console.log(resp.message);
                return $.alert('确认后返回车次选择', '加载数据错误', function () {
                    $('a.active').prev().click();
                });
            }
        },
        error: function (xhr) {
            $.hideLoading();
            console.log({'终点站加载失败': xhr});
            return $.alert('确认后返回车次选择', '加载数据错误', function () {
                $('a.active').prev().click();
            });
        }
    });
};

// 点击block切换导航
$('[data-name^="content"]').on('click', '.box-block', function () {
    $(this).addClass('click');
}).on('transitionend', '.box-block', function () {
    var value = $(this).find('span:first-child').text().trim(),
        target = $(this).data('target'),
        $target = $(target),
        toggle = $(this).data('toggle'),
        $span = $target.find('span'),
        $icon = $target.find('i'),
        old_value = $span.text(),
        $a = $target.parents('a'),
        $divs = $a.nextAll().find('.nav-value'),
        $next_spans = $divs.find('span'),
        $next_icons = $divs.find('i.iconfont');

    $(this).removeClass('click');

    // 车次查看全部
    if (toggle) {
        var $trip = $(this).parents('.trip-content'),
            $tripSearch = $trip.next();

        $trip.hide();
        $tripSearch.show().children('div').hide();
        $tripSearch.find(toggle).show();
        return false;
    }

    // 更改导航对应的值
    $span.text(value).show();

    // 值更改时后面的导航值变为icon
    if (value !== old_value) {
        $icon.hide();
        $next_spans.hide();
        $next_icons.show();
    }

    // 导航切换
    $($divs[0]).click();

    // obj 更改
    if (target === '#start') {
        obj['startStation'] = value;
        obj['startStationId'] = $(this).data('stationid');
        delete obj.trip;
        delete obj.destination;
        return renderTrain(obj.modify ? obj.trip : undefined);
    } else if (target === '#train') {
        delete obj.destination;
        obj['trip'] = value;
        obj['aboardTime'] = $(this).find('.time').text().trim();
        return renderDestination(obj.modify ? obj.destination : undefined);
    } else {
        obj['destination'] = value;
        obj['cityId'] = $(this).data('id');
        obj['arriveTime'] = $(this).data('time');
    }
});

// 模糊查询
function query(el) {
    var $that = $(el),
        value = $that.val().trim().toLowerCase(),
        $div = $that.parents('div.content').find('[data-name="content-search"]'),
        $notFound = $div.find('.not-found'),
        $block = $div.find('.box-block'),
        text = '',
        show = false,
        abbr, spell;

    if (value === "") {
        if ($(this).hasClass('trip')) {
            $div.hide().prev().show();
        }
        $block.filter(':hidden').show();
        show = true;
    } else {
        if ($(el).hasClass('trip')) {
            $div.show().prev().hide();
        }

        // 查询匹配
        $block.hide().each(function () {
            text = $(this).text().trim();
            if ($(this).data('target') === '#train') {
                text = $(this).find('.trip').text().trim().substring(1);
            } else {
                // 特殊属性检查
                try {
                    abbr = $(this).data('abbr').toLowerCase();
                    spell = $(this).data('spell').toLowerCase();
                    if (abbr.indexOf(value) !== -1 || spell.indexOf(value) !== -1) {
                        show = true;
                        return $(this).show();
                    }
                } catch (err) {
                    console.log(err)
                }
            }

            if (text.indexOf(value) !== -1) {
                show = true;
                return $(this).show();
            }
        });
    }

    if (!show) {
        $notFound.show();
    } else {
        $notFound.hide();
    }
}

$('input.weui-input').on('input paste propertychange', function () {
    query(this);
});

// 保存行程
function save_route(data, url) {
    $.support.cors = true;
    $.ajax({
        url: '/RailwayService/travelRoute/add',
        data: JSON.stringify({
            customerName: '',
            customerPhone: '',
            lineNo: data.trip,
            carriageNumber: '',
            seatNumber: '',
            aboardStation: data.startStation,
            arrivedStation: data.destination
        }),
        type: 'POST',
        contentType: 'application/json',
        dataType: 'json',
        timeout: 5 * 1000,
        beforeSend: function () {
            $.showLoading('保存行程中...');
        },
        success: function (resp) {
            $.hideLoading();
            if (resp.success) {
                // 记录中间站点
                data.stations = resp.data['listStationOnTheWay'];
                // 记录城市名
                data.city = resp.data['city'];
                data.toRoute = true;
                sessionStorage.setItem('route', JSON.stringify(data));
                $.toast('设置成功');
                setTimeout(function () {
                    window.location.href = url;
                }, 2000)
            } else {
                console.log(resp.message);
                return $.alert('行程保存失败', '错误');
            }
        },
        error: function (xhr) {
            $.hideLoading();
            console.log({'行程保存失败': xhr});
            return $.alert('行程保存失败', '错误');
        }
    });
}

// 表单提交
$('footer a').click(function () {
    var init = sessionStorage.init ? JSON.parse(sessionStorage.init) : undefined;
    // 判断是否保存行程信息
    if ($(this).data('name') === 'route') {
        if (obj.startStation && obj.trip && obj.destination) {
            obj.init = true;
        } else {
            $.toast('行程设置不正确', 'forbidden');
            return false;
        }

        // 是否从订单页面跳转过来的
        if (init) {
            if (!init.pass) {
                sessionStorage.removeItem('init');
            }
            if (obj.startStationId !== sessionStorage.stationId.trim()) {
                $.confirm('该商家所在站点不在该行程中, 是否继续?', '警告', function () {
                    return save_route(obj, init.url);
                });
            } else {
                return save_route(obj, init.url);
            }
        } else {
            return save_route(obj, 'index.html');
        }
    } else {
        // 是否从订单页面跳转过来的
        if (init) {
            if (!init.pass) {
                $.confirm('行程尚未设置完成是否跳过?', '提示', function () {
                    sessionStorage.setItem('shoppingCart', JSON.stringify(init.data));
                    sessionStorage.removeItem('init');
                    window.location.href = init.failed;
                });
            } else {
                $.confirm('不修改行程，返回支付页?', '提示', function () {
                    window.location.href = init.failed;
                });
            }
        } else {
            window.location.href = 'index.html';
        }
    }
});

// 非首页设置行程删除跳过按钮
if (sessionStorage.init) {
    $('div.skip').remove();
}


// 判断是新行程还是修改行程
if (!sessionStorage.route) {
    getCurrentStation();
} else {
    obj = JSON.parse(sessionStorage.route);
    obj.modify = true;
    // 渲染行程记录
    renderAllStations().done(function () {
        renderTrain().done(function () {
            renderDestination().done(function () {
                $('i.icon-xiala').hide();
                $('#start').find('span').text(obj.startStation).show();
                $('#train').find('span').text(obj.trip).show();
                $('#end').find('span').text(obj.destination).click().show();
                delete obj.modify;
            });
        });
    });
}